<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link href="../../css/list.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../font-awesome-4.7.0/css/font-awesome.min.css">
		<script src="../../js/mui.min.js"></script>
		 <script src="../../js/app.js"></script>
		 <script src="../../js/common.js"></script>
		 
		 <!--<link href="../css/style.css" rel="stylesheet" />-->
		 <style type="text/css">
		 	.speak{
	/*输入框居中漂浮*/
position: fixed;
width:100%;
top:50%;
/*left:50%;*/
margin: auto auto;
padding: 0 5px;
text-align: center;
}
		 	li span{
		 	margin: 10px;	
		 	}
		table,tr,td,th{
		padding: 0;
		margin: 0;
		}
		table{
		width: 100%;
		border-color: #ccc;
		}
		table tr{
			background: #fff;
		/*line-height: 30px;*/
		/*border-color: #ccc;*/
		}
		
		table th,table td{
			 padding: 8px;
		/*border-width: 0px;*/
		 /*border-style: solid;*/
		 /*border-color: #999999;*/
		}
		table tr:nth-child(even){
		background:#DCDCDC;
		}
		a{ text-decoration:none;
		}
		
		/*小盒子内容区的样式，display:inline-block：实现 效果*/
		#con{
			margin: 1px;
		}
		#con .pic{ border-radius:1px;float:left; max-height:180px;overflow:hidden;box-shadow:2px 2px 6px #b5b5b5;line-height:1.2;margin: 5px;padding:2px;}
		#con span{
			padding: 3px;
		}
		/*#con p{*/
			/*margin-bottom: 2px;*/
		/*}*/
		/*#con h5{padding:1px;margin-top: -2px;border-bottom:1px solid #ddd;}*/
		/*#con h5 a{text-decoration:none;color:#999;}*/
		.pic{
			max-width:150px;
			text-align:center;
			min-height:20px;
			padding:5px;
		}
		.pic img{
			margin:0;
			width:100%;
			min-height:10px;
			max-width:100px;
		}
		label{
			width:120px ;
			}
		label img{
			width:100px ;
			height: 20px;
			}
		.mui-input input{
			width: 70%;
			}
			li{list-style:none;}
	</style>
</head>
<body>
	<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
  <h1 class="mui-title">详情</h1><p id="titleright" style="float: right;font-size: 0.6em;">举报</p>
</header> 
    <div class="mui-content">
    	<div  style="width:50%;margin:0 auto;text-align:center" id="image"></div>
    	<!--内容-->
      <div id="neirong" class="mui-content-padded"></div>
      <!--图片集合-->
      <div class="slide-box"id="img"></div>
      <!--表格-->
      <div id="table" class="mui-content-padded"></div>
      <!--来源-->
      <div id="source" class="mui-content-padded"></div>
      <li style="padding:10px 20px;border-bottom: 1px solid #E3E3E3;">主题评论：</li>
		<div id="comment" class="mui-content-padded">
			 <!--评论信息-->
		</div>
    </div>
        <div  id="fabiao" style="display:block;position:fixed;right:30px;bottom:60px;background: #DD524D;color:#fff;border-radius:10px;padding: 5px;" >发表评论
</div>
    <div id="speak" class="speak" style="display:none;background: #DDDDDD;">
	<p style="margin:auto auto;font-size: 1.2em;color:#EC971F">发表评论</p>
	<textarea id="content" type="text" placeholder="留言"></textarea>
	<div style="margin-top: -24px;border-radius:5px;">
	<input id="pubish" style="font-size: 18px;margin: 2px 5px;padding:0 10px;float: right;" value="确认" type="submit" onclick="javascript:(document.getElementById('fabiao').style.display='block')">
	<input  style="font-size: 18px;margin: 2px 5px;float: right;padding:0 10px;" value="取消" type="submit" onclick="javascript:(document.getElementById('speak').style.display='none');javascript:(document.getElementById('fabiao').style.display='block')">
	</div>
</div>
    </body>
<script type="text/javascript">
var btn = document.getElementById("fabiao");
//监听点击事件
btn.addEventListener("tap",function () {
	 speak('',tid,'resource');
//	alert(tid);
console.log("tap event trigger"+tid);
});
//主图大图
function imageplay(image,tid){
	document.getElementById('image').innerHTML='<img  style="width:95%;" src="'+home.uploads+'/img/resource/min'+image+'" onerror="this.onerror=null;this.src=\'../../images/logo.png\'" />';
}
//附图多图//把图片追加到窗口
function imgplay(imgname){
	html='<div id="con"><div class="pic"><span><img src="'+home.uploads+'/img/resource/min'+imgname+'" onerror="this.onerror=null;this.src=\'../../images/logo.png\'" /></span></div></div>';
	document.getElementById('img').innerHTML+=html;
}
function jsonarrfor(result){
		if(result.pic){
		var pic='';
		if(result.pic.indexOf(",")){//如果字符串里含有逗号。遍历分割
			var rpic=result.pic.split(",");
				for(var ib=0;ib<rpic.length;ib++){//遍历图片
					imgplay(rpic[ib]);
				}
			}else{//如果只有一个图片无需遍历
				imgplay(rpic[ib]);
			}
  }
		
//var title='<h1 class="mui-title">项目概况<span>【'+result.stage+'】</span></h1>';
//完成进度
if(result.status==1){
	casestate='<span style="color:#00EE00;">●</span><span onclick="goto(\'chat\',\'user\',\'detail\','+result.user_id+')" style="border-radius:25px;border:2px solid #a1a1a1;padding:2px 5px">聊聊</span>';
}else{
	casestate='<span style="color:red;">■</span><span style="border-radius:25px;border:2px solid #a1a1a1;padding:2px 5px">忙碌</span>';
}
var birthday=new Date(parseInt(result.birthday) * 1000).format('yyyy年M月d日');
//形象头像
if(result.image && result.image.length>6){
imageplay(result.image,result.id);	
}
var title=result.world+':'+result.name;
val='<div style="text-align:center"><h3>'+title+'</h3></p><p  style="background: transparent;" >档期状态'+casestate+'</p><p><span>简介</span><br><span id="synopsis">'+result.synopsis+'</span></p></div></div><li style="border-bottom:solid 1px #333;"><span>影集</span></li>';
//	val+=arrjson[i].id;
document.getElementById('titleright').innerHTML='<div id="report" style="margin-top:10px;float:right">'+result.report+'</div><div style="float:right"><select style="padding:10px;background-color:transparent;" onchange="report('+result.id+',\'resource\',this)"><option>投诉</option><option>色情</option><option>侵权</option><option>脏话</option><option>诽谤</option><option>低俗</option><option>虚假</option><option>其他</option></select></div>';
//if(result.file || result.file==NULL || result.file=='0'){
	if(result.file){
		var download='<button type="button" class="mui-btn mui-btn-outlined mui-btn-danger"onclick="download('+result.id+',\''+result.name+'\')">下载详版文档</button>';

}else{
	var download='<button type="button" class="mui-btn mui-btn-outlined mui-btn-danger" >未上传附件</button>';
}
document.getElementById('neirong').innerHTML=val;
document.getElementById('table').innerHTML='<li style="border-bottom:solid 1px #333;"><span>基本信息</span></li><table><tr><td width="110px;text-align:right">合作方式</td><td>'+result.ways+'</td></tr><tr><td width="110px">地区</td><td>'+result.region+'</td></tr><tr><td>公司</td><td>'+result.company+'</td></tr><tr><td  colspan="2" style="text-align:center;color:#fff;" id="download">'+download+'</td></tr></th></tr></table>';
//document.getElementById('source').innerHTML='<p style="border-bottom:solid 1px #333;"><span>发布人:'+result.username+'</span></p>';
document.getElementById('source').innerHTML='<div style="width:100%;height:35px;font-size:0.8em;border-bottom: 1px solid #E3E3E3;text-align:center;"><div style="width: 33%;float:left">评论：<span id="commentnum">'+result.comment+' </span></div><div style="width: 33%; float:left"onclick="zan('+tid+',\'\',\'resource\')"><i class="fa fa-thumbs-o-up fa-1x"></i>：<span id="zan'+tid+'">'+result.zan+'</span></div><div style="width: 33%;float:left" onclick="addcollect('+tid+',\'resource\',\''+title+'\')">收藏：<span id="collectnum'+tid+'">'+result.collect+'</span></div></div>';
}

function download(tid,title){
	 mui.prompt('请输入授权码', '密码','' , ['取消','确认'], function(e) {
        if (e.index == 1) {
		host=home.hos+'/resource/download';
		jsondata='{"tid":"'+tid+'","act":"download","name":"'+title+'","ps":"'+e.value+'"}';
		createDownload(host,jsondata);
        }else{
        	alert('您选择了取消');
        }
    },'div')
//	alert('下载');
}

// 创建下载任务
function createDownload(host,jsondata) {
var w=plus.nativeUI.showWaiting("　　 正在请求...　　 ");
	var dtask = plus.downloader.createDownload(host,{filename:"_doc/",method:"POST",data:jsondata,timeout:60,retry:2,retryInterval:2}, 	function (d,status,e) {
//		plus.nativeUI.alert("返回值：" + JSON.stringify(d)+status+e);
		// 下载完成
		if ( status == 200 ) { 
			var btnArray = ['否', '是']; //弹框消息确认是否打开附件 
			mui.confirm('是否打开附件查看？', '下载成功', btnArray, function(e) { 
				if(e.index == 1) { //打开附件 
					plus.runtime.openFile(d.filename, {}, function(e) { //调用第三方应用打开文件 
					plus.runtime.launchApplication({ 
						pname: "com.chaozh.iReaderFree"
						}, function(e) { 
							plus.nativeUI.confirm('检查到您未安装文件查看器','是否需要下载安装？', function(i) { 
								if(i.index == 0) { 
								document.location.href = PDFAPPUrl 
								return; 
								} 
							}); 
							})
					}); 
				} else { //不打开
			                }
	        })
        } else {
            plus.nativeUI.alert("请求失败：没有您需要的文件"+status);
        }
   });
     dtask.addEventListener( "statechanged", function(task,status){
                        switch(task.state) {
                            case 1: // 开始
                                w.setTitle("　　 正在请求...　　 ");
                            break;
                            case 2: // 已连接到服务器
                                w.setTitle("　　 正在请求...　　 ");
                            break;
                            case 3:
                                var a = task.downloadedSize/task.totalSize*100;
                                w.setTitle("　　 已下载"+parseInt(a)+"%　　 ");
                            break;
                            case 4: // 下载完成
                                w.close();
                            break;
                        }
                  } );
                   dtask.start();
}


apptoken['tid']=tid;//获取详情id
apptoken['act']='detail';
mui.post(home.hos+'/resource?tid='+apptoken['tid'],apptoken,function(data){
//	alert(data);
	if(isJSON(data)){
//      			alert(data);
		result=JSON.parse(data);//获取信息
		jsonarrfor(result);//加载详情信息
		//获取评论信息
		list_comment(tid,'resource',0);
		}else{
			alert(apptoken['tid']+'页面加载失败，或不存在，请重新尝试');
			return false;
    	}
})

//图片单击大图控制插件
mui.plusReady(function() {
      var loopFlag = false; //默认不支持轮播
      var loopSwitch = document.getElementById('neirong');
      loopSwitch.addEventListener('toggle', function(event) {
        if(event.detail.isActive) {
          loopFlag = true;
        } else {
          loopFlag = false;
        }
      });
      var images = [].slice.call(document.querySelectorAll('.mui-content img'));
      var urls = [];
      images.forEach(function(item) {
		//遍历出图片连接，截取图片名把缩略图改成大图;单击显示大图；
      	var pathName=item.src.substring(item.src.lastIndexOf("/")+1);
      	var pos = item.src.indexOf(pathName);
        var imgsrc=item.src.substring(0, pos);
        var reg = new RegExp("min","g");
		var a = pathName.replace(reg,"");
		//拼接出新的图片名
      	path=imgsrc+a;
        urls.push(path);
      });
      mui('.mui-content').on('tap', 'img', function() {
        var index = images.indexOf(this);
        plus.nativeUI.previewImage(urls, {
          current: index,
          loop: loopFlag,
          indicator: 'number'
        });
      });
});

  </script>